<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>首頁</title>
    <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <link rel="stylesheet" href="../../plug-in/mui/css/mui.css">
    <link rel="stylesheet" href="../../plug-in/iconfont/iconfont.css">

    <link rel="stylesheet" href="../common/head.css">
    <link rel="stylesheet" href="index.css">
    <script src="../../plug-in/jquery/jquery-3.4.1.min.js"></script>

    <script src="../common/head.js"></script>

</head>

<body>

<header class="mui-bar mui-bar-nav common-header">
    <img src="../../img/logo.png" class="logo-img"/>
    <h1 class="mui-title">傾城</h1>
    <span id="searchBtn" class="mui-icon iconfont iconsearch search-btn"/>
</header>

<nav class="mui-bar mui-bar-tab common-nav">
    <a id="home" class="mui-tab-item mui-active">
        <span class="mui-icon iconfont iconhome"></span>
        <span class="mui-tab-label">首頁</span>
    </a>
    <a id="classify" class="mui-tab-item">
        <span class="mui-icon iconfont iconclassify"></span>
        <span class="mui-tab-label">分類</span>
    </a>
    <a id="cart" class="mui-tab-item" href="#tabbar-with-contact">
        <span class="mui-icon iconfont iconcart"></span>
        <span class="mui-tab-label">購物車</span>
    </a>
    <a id="me" class="mui-tab-item" href="#tabbar-with-map">
        <span class="mui-icon iconfont iconme"></span>
        <span class="mui-tab-label">我的</span>
    </a>
</nav>

<div class="mui-content">
    <div class="main-panel">
        <div class="mui-slider">
            <div class="mui-slider-group mui-slider-loop">
                <div class="mui-slider-item mui-slider-item-duplicate"><a href="#"><img src="../../img/home/feng1.png"/></a>
                </div>
                <div class="mui-slider-item"><a href="#"><img src="../../img/home/feng1.png"/></a></div>
                <div class="mui-slider-item"><a href="#"><img src="../../img/home/feng1.png"/></a></div>
                <div class="mui-slider-item"><a href="#"><img src="../../img/home/feng1.png"/></a></div>
                <div class="mui-slider-item"><a href="#"><img src="../../img/home/feng1.png"/></a></div>
                <div class="mui-slider-item mui-slider-item-duplicate"><a href="#"><img src="../../img/home/feng1.png"/></a>
                </div>
            </div>
        </div>
        <div class="common-flex-box mini-nav">
            <div class="item">
                <div class="circle" style="background-color: #a2cfba;">
                    <span class="mui-icon iconfont iconpeishi"></span>
                </div>
                <span class="title">
                    文藝配飾
                </span>
            </div>
            <div class="item">
                <div class="circle" style="background-color:#e9c6c0">
                    <span class="mui-icon iconfont iconfuzhuang"></span>
                </div>
                <span class="title">
                    時尚服裝
                </span>
            </div>
            <div class="item">
                <div class="circle" style="background-color:#efd3bd">
                    <span class="mui-icon iconfont iconmeitong"></span>
                </div>
                <span class="title">
                    靚麗美瞳
                </span>
            </div>
            <div class="item">
                <div class="circle" style="background-color:#91b7cc">
                    <span class="mui-icon iconfont iconmeirong"></span>
                </div>
                <span style="margin-top: 0.3rem; font-size: 0.38rem">
                    健康美容
                </span>
            </div>
        </div>
    </div>

    <div class="column1-panel">
        <span class="title">熱銷爆款</span>
        <div class="row">
            <div class="item">
                <img src="../../img/home/lanmu1/0618_03.png"/>
            </div>
            <div class="item">
                <img src="../../img/home/lanmu1/0618_03.png"/>
            </div>
        </div>

        <div class="row">
            <div class="item">
                <img src="../../img/home/lanmu1/0618_03.png"/>
            </div>
            <div class="item">
                <img src="../../img/home/lanmu1/0618_03.png"/>
            </div>
        </div>
    </div>

    <div class="column2-panel">
        <span class="title">新品首印</span>
        <div class="row">
            <div class="item">
                <img src="../../img/home/lanmu2/0618_16.png"/>
            </div>
            <div class="item">
                <img src="../../img/home/lanmu2/0618_18.png"/>
            </div>
            <div class="item">
                <img src="../../img/home/lanmu2/0618_16.png"/>
            </div>
        </div>
    </div>

    <div class="column3-panel">
        <span class="title">人氣推薦</span>
        <div class="list">
            <div class="item">
                <img src="../../img/home/lanmu3/0618_23.png"/>
            </div>
            <div class="item">
                <img src="../../img/home/lanmu3/0618_25.png"/>
            </div>
            <div class="item">
                <img src="../../img/home/lanmu3/0618_27.png"/>
            </div>
            <div class="item">
                <img src="../../img/home/lanmu3/0618_28.png"/>
            </div>
        </div>
    </div>
</div>

</body>

<script src="../../plug-in/mui/js/mui.js"></script>
<script src="../common/footer.js"></script>
<script type="text/javascript" charset="utf-8" src="index.js"></script>

</html>
